<template>

  <div>
    <Card v-if="$store.state.superAdmin == 'true'" style="margin-bottom:10px">
      <el-select style="width:100%" v-model="museumId" @change="getExhibitionHallList" filterable placeholder="请选择博物馆">
          <el-option
            v-for="item in museumList"
            :key="item.id"
            :label="item.name"
            :value="item.id">
          </el-option>
        </el-select>
      </Card>
    <Card>

    <div class="flexCSB">
      <div style="display:flex">
        <Button type="primary" @click="create" :loading="loading4">新增层级</Button>
        <Button type="warning" style="margin-left:10px" @click="createCode" :loading="loadingDaolan">导出场馆物料二维码</Button>
        <Button type="warning" style="margin-left:10px" @click="createCodeSun" :loading="loadingDaolan2">导出场馆太阳二维码</Button>
        <Button type="info" :disabled="!chooseCode.length" style="margin-left:10px" @click="downloadCodeMore" :loading="loadingCengji">导出所选层级二维码</Button>
      </div>
    </div>

    <Table @on-selection-change="onSelectionChange" class="table" :loading="loading1" highlight-row :columns="columns" :data="data"></Table>

    <Modal width="50" v-model="modal" title="层级操作">
      <Form ref="form" :model="newData" :label-width="100">
        <FormItem label="层级级数：">
          <Select v-model="newData.parentId" filterable>
            <Option value="0">顶级</Option>
            <template v-for="item in parentIdList">
              <Option :value="item.id">{{item.name}}</Option>
            </template>
          </Select>
        </FormItem>
        <FormItem label="展览类型：">
          <Select v-model="newData.exhibitionTypeId">
            <Option value="1">常设展览</Option>
            <Option value="2">临时展览</Option>
          </Select>
        </FormItem>
        <FormItem label="层级名称：">
          <Input placeholder="请输入层级名称" v-model="newData.name" clearable></Input>
        </FormItem>
        <FormItem label="权重：">
          <Input-number :min="1" v-model="newData.sort"></Input-number>
        </FormItem>

        <FormItem label="层级简介：">
          <Input
            placeholder="请输入层级简介"
            :rows="6"
            maxlength="5000"
            show-word-limit
            type="textarea"
            v-model="newData.about"
            clearable
          ></Input>
        </FormItem>

        <FormItem label="层级封面：">
          <vue-uploadimg :imgUrl="imgUrl1" :clear="clear1" @uploadImg="uploadImg1"></vue-uploadimg>
        </FormItem>
        <FormItem label="层级图库：">
          <vue-uploadimgmore :imgUrl="imgurl2" :clear="clear2" @uploadImg="uploadImg2"></vue-uploadimgmore>
        </FormItem>
        <Divider>非必填</Divider>
        <FormItem label="英文名称：">
          <Input placeholder="请输入层级英文名称" v-model="newData.nameEn" clearable></Input>
        </FormItem>
        <FormItem label="英文简介：">
          <Input
            placeholder="请输入英文层级简介"
            :rows="6"
            maxlength="5000"
            show-word-limit
            type="textarea"
            v-model="newData.aboutEn"
            clearable
          ></Input>
        </FormItem>
      </Form>
      <div slot="footer">
        <Button type="dashed" class="Button" @click="modal = false">取消</Button>
        <Button class="Button" type="primary" @click="submit" :loading="loading2">确认提交</Button>
      </div>
    </Modal>

    <Modal title="下一层级" v-model="modal2" fullscreen>
      <Button type="info" :disabled="!chooseCode2.length" style="margin-left:10px" @click="downloadCodeMore2" :loading="loadingCengji2">导出所选层级二维码</Button>
      <Table @on-selection-change="onSelectionChange2" class="table" :loading="loading3" highlight-row :columns="columns2" :data="data2"></Table>
      <div slot="footer">
        <Button type="warning" class="Button" @click="modal2 = fals">关闭</Button>
      </div>
    </Modal>

    <Modal title="下一层级" v-model="modal3" fullscreen>
      <Table class="table" :loading="loading5" highlight-row :columns="columns3" :data="data3"></Table>
      <div slot="footer">
        <Button type="warning" class="Button" @click="modal3 = false">关闭</Button>
      </div>
    </Modal>

    <Modal title="查看图片" v-model="modelImg">
      <img style="width:100%" :src="modelImgSrc"></img>
      <div slot="footer">
        <Button type="warning" class="Button" @click="modelImg = false">关闭</Button>
      </div>
    </Modal>

  </Card>
</div>
</template>

<script>
import axios from 'axios'
export default {
  data () {
    return {
      loading1: false,
      loading2: false,
      loading3: false,
      loading4: false,
      loading5: false,
      loadingDaolan: false,
      loadingDaolan2: false,
      loadingCengji: false,
      loadingCengji2: false,

      museumId: '',
      museumList: [],
      chooseCode: [],
      chooseCode2: [],
      name: '',

      columns: [
        {
          type: 'selection',
          width: 60,
          align: 'center'
        },
        { title: '层级名称', key: 'name', align: 'center' },
        { title: '英文层级名称', key: 'nameEn', align: 'center' },
        // { title: "层级简介", key: "about", align: "center", minWidth: 200 },
        // { title: "层级类型", key: "type2", align: "center" },
        {title: '展览类型',
          align: 'center',
		            	render: (h, params) => {
							 let color = ''
							 let content = ''
							 if (params.row.exhibitionTypeId == '1') {
							 	color = 'blue'
								 content = '常设展览'
							 }
							 if (params.row.exhibitionTypeId == '2') {
								 color = 'red'
								 content = '临时展览'
            }
		              		return h(
							 'Tag',
							 {
								 props: { color: color }
							 },
							 	content
            )
		           	 	}
		          	},
        {
          title: '层级封面',
          key: 'mainPic',
          align: 'center',
          render: (h, params) => {
            return h('img', {
              style: {
                width: '50px'
              },
              attrs: {
                src: this.prefix + params.row.mainPic
              },
              on: {
                click: () => {
                  this.lookImg(params.row.mainPic)
                }
              }
            })
          }
        },
        {
          title: '层级图库',
          align: 'center',
          render: (h, params) => {
            return h(
              'div',
              {
                style: {
                  display: 'flex',
                  justifyContent: 'center',
                  flexWrap: 'wrap'
                }
              },
              params.row.newPics.map(v => {
                return h('img', {
                  style: {
                    width: '50px',
                    height: '50px',
                    margin: '10px'
                  },
                  attrs: {
                    src: this.prefix + v
                  },
                  on: {
                    click: () => {
                      this.lookImg(params.row.mainPic)
                    }
                  }
                })
              })
            )
          }
        },
        {
          title: '操作',
          align: 'center',
          render: (h, params) => {
            return h(
              'div',
              {
                style: {
                  padding: '5px 0'
                }
              },
              [
                h(
                  'Button',
                  {
                    props: {
                      type: 'info'
                    },
                    style: {
                      display: 'block',
                      marginBottom: '10px'
                    },
                    on: {
                      click: () => {
                        this.downloadCode(params)
                      }
                    }
                  },
                  '导出二维码'
                ),
                h(
                  'Button',
                  {
                    props: {
                      type: 'success',
                      disabled: !params.row.hasChild
                    },
                    style: {
                      display: 'block'
                    },
                    on: {
                      click: () => {
                        this.next(params)
                      }
                    }
                  },
                  '下一层级'
                ),
                h(
                  'Button',
                  {
                    props: {
                      type: 'warning'
                    },
                    style: {
                      display: 'block',
                      margin: '10px 0'
                    },
                    on: {
                      click: () => {
                        this.update(params)
                      }
                    }
                  },
                  '修改层级'
                ),
                h(
                  'Button',
                  {
                    props: { type: 'error' },
                    style: {
                      display: 'block'
                    },
                    on: {
                      click: () => {
                        this.del(params)
                      }
                    }
                  },
                  '删除层级'
                )
              ]
            )
          }
        }
      ],
      data: [],

      modal: false,
      newData: {
        about: '',
        aboutEn: '',
        mainPic: '',
        name: '',
        nameEn: '',
        parentId: '0',
        sort: 1,
        type: '1',
        pics: [],
        exhibitionTypeId: '1'
      },
      id: '',
      parentIdList: [],

      imgUrl1: '',
      clear1: false,
      imgurl2: [],
      clear2: true,

      modal2: false,
      columns2: [
        {
          type: 'selection',
          width: 60,
          align: 'center'
        },
        { title: '层级名称', key: 'name', align: 'center' },
        { title: '英文层级名称', key: 'nameEn', align: 'center' },
        // { title: "层级类型", key: "type2", align: "center" },
        {
          title: '层级封面',
          key: 'mainPic',
          align: 'center',
          render: (h, params) => {
            return h('img', {
              style: {
                width: '100px',
                marginTop: '6px'
              },
              attrs: {
                src: this.prefix + params.row.mainPic
              }
            })
          }
        },
        {
          title: '层级图库',
          align: 'center',
          render: (h, params) => {
            return h(
              'div',
              {
                style: {
                  display: 'flex',
                  justifyContent: 'center',
                  flexWrap: 'wrap'
                }
              },
              params.row.newPics.map(v => {
                return h('img', {
                  style: {
                    width: '50px',
                    height: '50px',
                    margin: '10px'
                  },
                  attrs: {
                    src: this.prefix + v
                  },
                  on: {
                    click: () => {
                      this.lookImg(params.row.mainPic)
                    }
                  }
                })
              })
            )
          }
        },
        {
          title: '操作',
          align: 'center',
          render: (h, params) => {
            return h(
              'div',
              {
                style: {
                  padding: '5px 0'
                }
              },
              [
                // h(
                //   "Button",
                //   {
                //     props: {
                //       type: "success",
                //       disabled: !params.row.hasChild ? true : false
                //     },
                //     style: {
                //       display: "block"
                //     },
                //     on: {
                //       click: () => {
                //         this.next2(params);
                //       }
                //     }
                //   },
                //   "下一层级"
                // ),
                h(
                  'Button',
                  {
                    props: {
                      type: 'info'
                    },
                    style: {
                      display: 'block'
                    },
                    on: {
                      click: () => {
                        this.downloadCode(params)
                      }
                    }
                  },
                  '导出二维码'
                ),
                h(
                  'Button',
                  {
                    props: {
                      type: 'warning'
                    },
                    style: {
                      display: 'block',
                      margin: '10px 0'
                    },
                    on: {
                      click: () => {
                        this.update(params)
                      }
                    }
                  },
                  '修改层级'
                ),
                h(
                  'Button',
                  {
                    props: { type: 'error' },
                    style: {
                      display: 'block'
                    },
                    on: {
                      click: () => {
                        this.del(params)
                      }
                    }
                  },
                  '删除层级'
                )
              ]
            )
          }
        }
      ],
      data2: [],

      modal3: false,
      columns3: [
        { title: '层级名称', key: 'name', align: 'center' },
        { title: '英文层级名称', key: 'nameEn', align: 'center' },
        // { title: "层级类型", key: "type2", align: "center" },
        {
          title: '层级封面',
          key: 'mainPic',
          align: 'center',
          render: (h, params) => {
            return h('img', {
              style: {
                width: '100px',
                marginTop: '6px'
              },
              attrs: {
                src: this.prefix + params.row.mainPic
              }
            })
          }
        },
        {
          title: '层级图库',
          align: 'center',
          render: (h, params) => {
            return h(
              'div',
              {
                style: {
                  padding: '5px 0'
                }
              },
              params.row.newPics.map(v => {
                return h('img', {
                  style: {
                    width: '50%',
                    display: 'block',
                    marginLeft: '25%',
                    marginTop: '5px'
                  },
                  attrs: {
                    src: this.prefix + v
                  }
                })
              })
            )
          }
        },
        {
          title: '操作',
          align: 'center',
          render: (h, params) => {
            return h(
              'div',
              {
                style: {
                  padding: '5px 0'
                }
              },
              [
                h(
                  'Button',
                  {
                    props: {
                      type: 'warning'
                    },
                    style: {
                      display: 'block',
                      'margin-bottom': '10px'
                    },
                    on: {
                      click: () => {
                        this.update(params)
                      }
                    }
                  },
                  '修改层级'
                ),
                h(
                  'Button',
                  {
                    props: { type: 'error' },
                    style: {
                      display: 'block'
                    },
                    on: {
                      click: () => {
                        this.del(params)
                      }
                    }
                  },
                  '删除层级'
                )
              ]
            )
          }
        }
      ],
      data3: [],
      modelImg: false,
      modelImgSrc: ''
    }
  },
  created () {
    if (this.$store.state.superAdmin == 'true') {
      this.getAppMuseumDropDown()
    } else {
      this.museumId = this.$store.state.museumId
      this.getExhibitionHallList()
    }
  },
  methods: {
    getAppMuseumDropDown () {
      this.loading1 = true
      this.$http('/stage/museum/getAppMuseumDropDown', {}, 'post', res => {
        if (res.data.code == 200) {
          this.museumList = res.data.data
          for (let i = 0; i < this.museumList.length; i++) {
            if (this.museumList[i].name.length > 20) {
              this.museumList[i].name =
                this.museumList[i].name.slice(0, 20) + '...'
            }
          }
          // this.museumId = '3728'
          this.museumId = this.museumList[0].id
          this.getExhibitionHallList()
        } else {
          this.$Message.error(res.data.msg)
        }
      })
    },
    // 获取所有层级
    // getExhibitionHallDropDown() {
    //   this.parentIdList = [];
    //   this.$http(
    //     "/stage/hall/getExhibitionHallDropDown",
    //     {
    //       museumId: this.museumId
    //     },
    //     "get",
    //     res => {
    //       if (res.data.code == 200) {
    //         for (let i = 0; i < res.data.data.length; i++) {
    //           this.parentIdList.push({
    //             id: res.data.data[i].id,
    //             name: res.data.data[i].name
    //           });
    //         }
    //       } else {
    //         this.$Message.error(res.data.msg);
    //       }
    //       this.loading1 = false;
    //     }
    //   );
    // },
    getExhibitionHallList () {
      this.chooseCode = []
      this.loading1 = true
      this.$http(
        '/stage/hall/getExhibitionHallList',
        {
          museumId: this.museumId,
          parentId: '0'
        },
        'post',
        res => {
          // this.getExhibitionHallDropDown();
          if (res.data.code == 200) {
            this.data = res.data.data
            this.parentIdList = []
            for (let i = 0; i < this.data.length; i++) {
              this.parentIdList.push({
                id: this.data[i].id,
                name: this.data[i].name
              })
              if (this.data[i].pics != undefined) {
                this.data[i].newPics = this.data[i].pics.split(',')
              } else {
                this.data[i].newPics = []
              }
              // if (this.data[i].type == 1) {
              //   this.data[i].type2 = "展区";
              // }
              // if (this.data[i].type == 2) {
              //   this.data[i].type2 = "展厅";
              // }
              // if (this.data[i].type == 3) {
              //   this.data[i].type2 = "馆区";
              // }
            }
          } else {
            this.$Message.error(res.data.msg)
          }
          this.loading1 = false
        }
      )
    },
    create () {
      this.modal = true
      this.newData = {
        about: '',
        aboutEn: '',
        mainPic: '',
        name: '',
        nameEn: '',
        sort: 1,
        parentId: '0',
        // type: "1",
        pics: [],
        exhibitionTypeId: '1'
      }
      this.imgUrl1 = ''
      this.clear1 = !this.clear1
      this.imgurl2 = []
      this.clear2 = !this.clear2
      this.id = ''
    },
    update (params) {
      this.id = params.row.id
      this.newData = {
        about: params.row.about,
        aboutEn: params.row.aboutEn,
        nameEn: params.row.nameEn,
        name: params.row.name,
        sort: params.row.sort,
        parentId: params.row.parentId,
        // type: '1',
        type: params.row.type.toString(),
        exhibitionTypeId: params.row.exhibitionTypeId
      }
      if (params.row.mainPic) {
        this.imgUrl1 = params.row.mainPic
        this.newData.mainPic = params.row.mainPic
      } else {
        this.imgUrl1 = ''
        this.newData.mainPic = ''
      }
      this.imgurl2 = []
      this.newData.pics = []
      if (params.row.pics) {
        for (let i = 0; i < params.row.pics.split(',').length; i++) {
          this.imgurl2.push({
            name: params.row.pics.split(',')[i],
            url: params.row.pics.split(',')[i]
          })
          this.newData.pics.push(params.row.pics.split(',')[i])
        }
        this.clear2 = !this.clear2
      }
      this.modal = true
    },
    submit () {
      if (this.newData.name == '') {
        this.$Message.error('层级名称不能为空')
        return false
      }
      if (this.newData.about == '') {
        this.$Message.error('层级简介不能为空')
        return false
      }
      if (this.newData.mainPic == '') {
        this.$Message.error('请上传层级主图')
        return false
      }
      if (this.newData.pics.length == 0) {
        this.$Message.error('请上传层级图片')
        return false
      }
      if (this.id == '') {
        this.loading2 = true
        this.$http(
          '/stage/hall/saveExhibitionHall',
          {
            museumId: this.museumId,
            about: this.newData.about,
            aboutEn: this.newData.aboutEn,
            mainPic: this.newData.mainPic,
            name: this.newData.name,
            nameEn: this.newData.nameEn,
            parentId: this.newData.parentId,
            sort: this.newData.sort,
            type: '1',
            // type: this.newData.type,
            pics: this.newData.pics,
            exhibitionTypeId: this.newData.exhibitionTypeId
          },
          'post',
          res => {
            if (res.data.code == 200) {
              this.$Message.success('新增层级成功')
              this.getExhibitionHallList()
              this.modal = false
            } else {
              this.$Message.error(res.data.msg)
            }
            this.loading2 = false
          }
        )
      } else {
        this.loading2 = true
        this.$http(
          '/stage/hall/updateExhibitionHall',
          {
            museumId: this.museumId,
            about: this.newData.about,
            aboutEn: this.newData.aboutEn,
            mainPic: this.newData.mainPic,
            name: this.newData.name,
            nameEn: this.newData.nameEn,
            parentId: this.newData.parentId,
            sort: this.newData.sort,
            type: '1',
            // type: this.newData.type,
            id: this.id,
            pics: this.newData.pics,
            exhibitionTypeId: this.newData.exhibitionTypeId
          },
          'post',
          res => {
            if (res.data.code == 200) {
              this.$Message.success('修改层级成功')
              this.getExhibitionHallList()
              this.modal = false
              this.modal2 = false
              this.modal3 = false
            } else {
              this.$Message.error(res.data.msg)
            }
            this.loading2 = false
          }
        )
      }
    },
    uploadImg1 (data) {
      this.newData.mainPic = data
    },
    uploadImg2 (data) {
      this.newData.pics = []
      for (let i = 0; i < data.length; i++) {
        this.newData.pics.push(data[i].url)
      }
    },
    del (params) {
      this.$Modal.confirm({
        title: '提示',
        content: '<p>确定要删除<strong> ' + params.row.name + ' </strong>吗？</p>',
        onOk: () => {
          this.loading1 = true
          this.loading3 = true
          this.$http(
            '/stage/hall/deleteExhibitionHall',
            {
              id: params.row.id
            },
            'get',
            res => {
              if (res.data.code == 200) {
                this.$Message.success('删除层级成功')
                this.getExhibitionHallList()
                this.modal2 = false
                this.modal3 = false
              } else {
                this.$Message.error(res.data.msg)
              }
              this.loading1 = false
              this.loading3 = false
            }
          )
        },
        onCancel: () => {}
      })
    },
    next (params) {
      this.chooseCode2 = []
      this.modal2 = true
      this.loading3 = true
      this.$http(
        '/stage/hall/getExhibitionHallList',
        {
          museumId: this.museumId,
          parentId: params.row.id
        },
        'post',
        res => {
          if (res.data.code == 200) {
            this.data2 = res.data.data
            for (let i = 0; i < this.data2.length; i++) {
              if (this.data2[i].pics != undefined) {
                this.data2[i].newPics = this.data2[i].pics.split(',')
              } else {
                this.data2[i].newPics = []
              }
            //   if (this.data2[i].type == 1) {
            //     this.data2[i].type2 = "展区";
            //   }
            //   if (this.data2[i].type == 2) {
            //     this.data2[i].type2 = "展厅";
            //   }
            //   if (this.data2[i].type == 3) {
            //     this.data2[i].type2 = "馆区";
            //   }
            }
          } else {
            this.$Message.error(res.data.msg)
          }
          this.loading3 = false
        }
      )
    },
    next2 (params) {
      this.modal3 = true
      this.loading5 = true
      this.$http(
        '/stage/hall/getExhibitionHallList',
        {
          museumId: this.museumId,
          parentId: params.row.id
        },
        'post',
        res => {
          if (res.data.code == 200) {
            this.data3 = res.data.data
            // for (let i = 0; i < this.data3.length; i++) {
            //   if (this.data3[i].type == 1) {
            //     this.data3[i].type2 = "展区";
            //   }
            //   if (this.data3[i].type == 2) {
            //     this.data3[i].type2 = "展厅";
            //   }
            //   if (this.data3[i].type == 3) {
            //     this.data3[i].type2 = "馆区";
            //   }
            // }
          } else {
            this.$Message.error(res.data.msg)
          }
          this.loading5 = false
        }
      )
    },
    lookImg (data) {
      this.modelImg = true
      this.modelImgSrc = this.prefix + data
    },
    createCode () {
      this.loadingDaolan = true
      let that = this
      axios({
        method: 'get',
        url: this.baseUrl + '/stage/qrCode/exportMuseumQRCode',
        headers: {
          'token': this.$store.state.token || localStorage.getItem('token') || '',
          'Content-Type': 'application/json;charset=UTF-8'
        },
        responseType: 'blob',
        params: {
          museumId: this.museumId
        }
      }).then(function (res) {
        that.loadingDaolan = false
        let filename = res.headers['content-disposition'].split('filename=')[1]
        let blob = new Blob([res.data], {
          type: 'application/x-zip-compressed'
        })
        let objectUrl = URL.createObjectURL(blob)
        let a = document.createElement('a')
        a.href = objectUrl
        a.download = decodeURI(filename)
        a.dispatchEvent(new MouseEvent('click', {bubbles: true, cancelable: true, view: window}))
        window.URL.revokeObjectURL(blob)
      }).catch(resp => {
        that.loadingDaolan = false
      })
    },
    createCodeSun () {
      this.loadingDaolan2 = true
      let that = this
      axios({
        method: 'get',
        url: this.baseUrl + '/stage/qrCode/exportGuideMuseumQrCode',
        // url: this.baseUrl + '/stage/qrCode/exportMuseumQRCode',
        headers: {
          'token': this.$store.state.token || localStorage.getItem('token') || '',
          'Content-Type': 'application/json;charset=UTF-8'
        },
        responseType: 'blob',
        params: {
          museumId: this.museumId
        }
      }).then(function (res) {
        that.loadingDaolan2 = false
        let filename = res.headers['content-disposition'].split('filename=')[1]
        let blob = new Blob([res.data], {
          type: 'application/x-zip-compressed'
        })
        let objectUrl = URL.createObjectURL(blob)
        let a = document.createElement('a')
        a.href = objectUrl
        a.download = decodeURI(filename)
        a.dispatchEvent(new MouseEvent('click', {bubbles: true, cancelable: true, view: window}))
        window.URL.revokeObjectURL(blob)
      }).catch(resp => {
        that.loadingDaolan2 = false
      })
    },
    downloadCode (params) {
      let that = this
      axios({
        method: 'post',
        url: this.baseUrl + '/stage/qrCode/exportShowroomQRCode',
        headers: {
          'token': this.$store.state.token || localStorage.getItem('token') || '',
          'Content-Type': 'application/json;charset=UTF-8'
        },
        responseType: 'blob',
        params: {
          appMuseumId: this.museumId,
          ids: params.row.id
        }
      }).then(function (res) {
        let filename = res.headers['content-disposition'].split('filename=')[1]
        let blob = new Blob([res.data], {
          type: 'application/x-zip-compressed'
        })
        let objectUrl = URL.createObjectURL(blob)
        let a = document.createElement('a')
        a.href = objectUrl
        a.download = decodeURI(filename)
        a.dispatchEvent(new MouseEvent('click', {bubbles: true, cancelable: true, view: window}))
        window.URL.revokeObjectURL(blob)
      }).catch(resp => {

      })
    },
    downloadCodeMore () {
      let ids = []
      for (let i of this.chooseCode) {
        ids.push(i.id)
      }
      let that = this
      this.loadingCengji = true
      axios({
        method: 'post',
        url: this.baseUrl + '/stage/qrCode/exportShowroomQRCode',
        headers: {
          'token': this.$store.state.token || localStorage.getItem('token') || '',
          'Content-Type': 'application/json;charset=UTF-8'
        },
        responseType: 'blob',
        params: {
          appMuseumId: this.museumId,
          ids: ids.join(',')
        }
      }).then(function (res) {
        that.loadingCengji = false
        let filename = res.headers['content-disposition'].split('filename=')[1]
        let blob = new Blob([res.data], {
          type: 'application/x-zip-compressed'
        })
        let objectUrl = URL.createObjectURL(blob)
        let a = document.createElement('a')
        a.href = objectUrl
        a.download = decodeURI(filename)
        a.dispatchEvent(new MouseEvent('click', {bubbles: true, cancelable: true, view: window}))
        window.URL.revokeObjectURL(blob)
      }).catch(resp => {
        that.loadingCengji = false
      })
    },
    onSelectionChange (data) {
      this.chooseCode = data
    },
    onSelectionChange2 (data) {
      this.chooseCode2 = data
    },
    downloadCodeMore2 () {
      let ids = []
      for (let i of this.chooseCode2) {
        ids.push(i.id)
      }
      let that = this
      this.loadingCengji2 = true
      axios({
        method: 'post',
        url: this.baseUrl + '/stage/qrCode/exportShowroomQRCode',
        headers: {
          'token': this.$store.state.token || localStorage.getItem('token') || '',
          'Content-Type': 'application/json;charset=UTF-8'
        },
        responseType: 'blob',
        data: {
          appMuseumId: this.museumId,
          ids: ids.join(',')
        }
      }).then(function (res) {
        that.loadingCengji2 = false
        let filename = res.headers['content-disposition'].split('filename=')[1]
        let blob = new Blob([res.data], {
          type: 'application/x-zip-compressed'
        })
        let objectUrl = URL.createObjectURL(blob)
        let a = document.createElement('a')
        a.href = objectUrl
        a.download = decodeURI(filename)
        a.dispatchEvent(new MouseEvent('click', {bubbles: true, cancelable: true, view: window}))
        window.URL.revokeObjectURL(blob)
      }).catch(resp => {
        that.loadingCengji2 = false
      })
    }

  }
}
</script>

<style scoped>
</style>
